<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript"
	src="vue.min.js">
</script>


</head>
<body>
	<!--view层
{{}}表示文本插值，运行{{message}}会被数据对象的message属性替换。
  -->
	<div id="app">

		<p>{{message1}}<input type="text" v-model="message1" /></p>
        <p>{{message2}}<textarea v-model="message2"></textarea></p>
		
        <input type="radio" v-model="radio1" />aa
        <input type="radio" v-model="radio1" />bb

	</div>

<script>
	/* Model层 */
	var exampleData = {
		message1 : 'hello World!',
        message2 : 'AAAA',
        radio1 : false
        
	}
	/*     ViewModel层,连接view和model层
	 vue实例需要传入一个选项对象
	 选项对象包括挂载对象，数据，方法，模生命周期钩子（？）
	 el属性指向view,表示把vue实例绑定某个dom元素
	 */
	new Vue({
		el : '#app',
		data : exampleData
	})
</script>
</body>



</html>